<template>
  <!--常见问题-->
<div class="container1">
  <div class="noData" v-if="myPrizeDate.length==0">
    <img src="../../assets/GZH/no-data.png" alt="" />
  </div>
  <div class="prize-list" v-else>
    <div class="item" v-for="(item, index) in myPrizeDate" :key="index">
      <img class="img" :src="item.prizeImg" alt="">
      <div class="right-text">
        <div class="title">{{item.prize}}</div>
        <div style="color:#ff4545;">{{item.redPackTipMsg}}</div>
        <!-- <div>{{item.subName}}</div> -->
        <!-- <div class="top40"></div> -->
        <div class="top40">{{item.remark}}</div>
      </div>
    </div>

  </div>
</div>

</template>
<script>

export default {
  components:{

  },
  data(){
    return{
      token:'',
      myPrizeDate:[]
    }
  },
  mounted(){
    this.token = localStorage.getItem('token')||'';
    let url  = location.href.split("#")[0];
    console.log(this.token)
    setTimeout(()=>{
      if(url.indexOf('https')==0){
        this.myPrize1();
      }else{
        this.myPrize();
      }

    },200)
  },
  methods:{
    myPrize(){
      let _this = this;
        this.$api.get("/activity/v1/authExpApi/prize",{},s => {
          console.log(s);
          if(!s.module){
            _this.myPrizeDate = []
          } else{
            _this.myPrizeDate = s.module
          }
      },f => {

      },{
        "Content-Type": "application/x-www-form-urlencoded",
        Accept: "*/*",
        expToken:this.token
      });
    },
    myPrize1(){
      let _this = this;
        this.$api.get1("/activity/v1/authExpApi/prize",{},s => {
          console.log(s);
          if(!s.module){
            _this.myPrizeDate = []
          } else{
            _this.myPrizeDate = s.module
          }
      },f => {

      },{
        "Content-Type": "application/x-www-form-urlencoded",
        Accept: "*/*",
        expToken:this.token
      });
    },
  }
}
</script>
<style>
body, html {
    width:100%;
    height:auto;
}
</style>

<style scoped lang="scss">
.container1{
  width:100%;
  height:100%;
  min-height: 16rem;
  background:#f2f2f2;
}
.noData{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width:200px;
  height:200px;
  margin:50px auto;
}
.noData img{
  width:129px;
  height:123px;
}
.prize-list{
  width:350px;
  min-height:125px;
  margin:0 auto;
}
.item{
  display:flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width:100%;
  height:125px;
  padding:11px;
  margin-top:30px;
  border-radius: 12px;
  background: #fff;
}
.img{
  width:105px;
  height:105px;
}
.right-text{
  text-align: left;
  width:250px;
  height:105px;
  padding-left:16px;
  font-size:12px;
  line-height:20px;
  color:#999;
}
.title{
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size:16px;
  line-height:24px;
  font-weight:500;
  color:#333;
}
.top40{
  margin-top:30px;
}
</style>